<template>
  <!-- 积分统计 -->
  <div class="app-container calendar-list-container">
    <section>
      <el-row>
        <el-col :span="5">
          <section class="search-box">
            <section class="search-inp">
              <el-input placeholder="请输入内容" prefix-icon="el-icon-search">
              </el-input>
            </section>
            <section class="menu-tree">
              <el-tree :data="menuDeptList" node-key="id" default-expand-all :expand-on-click-node="false">
                <span slot-scope="{ node, data }" @click="findRecordList(data)">
                  <i class="iconfont ali-wenjianjia1"></i>
                  <span>{{ node.label }}</span>
                </span>
              </el-tree>
            </section>
          </section>
        </el-col>
        <el-col :span="19">
          <router-view></router-view>
        </el-col>
      </el-row>
    </section>
  </div>
</template>
<script>
import { mapGetters } from "vuex";
export default {
  name: "integralCount",
  computed: {
    ...mapGetters(["menuDeptList"]),
  },
  methods: {
    findRecordList(e){
      this.$router.push("/integralCount/list")
      this.$nextTick( _=> {
        this.$store.dispatch("findRecordListById", e);
      })
    },
    async initList(){
      if(this.menuDeptList.length > 0){
        this.$store.dispatch("findRecordListById", this.menuDeptList[0]);
      }else{
        let dept = await this.$store.dispatch("SetDeptList");
        this.$store.dispatch("findRecordListById", dept[0]);
      }
    }
  },
  created(){
    this.initList();
  }
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.search-box {
  background-color: #fff;
  padding: 20px;
  margin-right: 20px;
  .menu-tree {
    span {
      font-size: 13px;
    }
  }
}
.ali-wenjianjia1 {
  color: #b8e8ff;
}
</style>


